<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>listFile</title>
</head>
<body>
<h3 id="h3">Files of: </h3>
<ul id="fileList"></ul>
</body>
</html>
<script src="/fs/statics/js/common.js"></script>
<script>
    let servicePrefix = "/fs" // 服务名前缀，nginx转发使用
    let dirFileListUri = "/fs/api/dirFileList"
    let downloadUri = "/fs/api/download"
    let deleteFileUri = "/fs/api/deleteFile"
    let directoryImageUri = "/fs/statics/images/文件夹.png"
    let fileImageUri = "/fs/statics/images/文件.png"
    window.onload = function () {
        let path = decodeURI(getPath())
        console.log(path)
        console.log("url编码后: " + encodeURI(path))
        document.getElementById("h3").innerHTML = "Files of: " + path
        let queryParams = new URLSearchParams();
        queryParams.append("dir", encodeURI(path))
        ajax(dirFileListUri + "?" + queryParams.toString(), "GET", null, function (result) {
            if (result.code !== 200) {
                alert(result.code + ": " + result.msg)
                return false
            }
            let data = result.data
            if (data == null) {
                return false
            }
            let htmlStr = ""
            for (let i = 0; i < data.length; i++) {
                let fileInfo = data[i];
                htmlStr += '<li>'
                if (fileInfo.isDir) {
                    htmlStr += '<img src="' + directoryImageUri + '" alt="dir" style="width: 1.5em">'
                    htmlStr += '<a href="/fs/' + fileInfo.path + '">' + fileInfo.filename + '</a>'
                } else {
                    let key = fileInfo.key
                    htmlStr += '<button id="btn-' + key + '" onclick="deleteFile(\'' + key + '\')">删除</button>&nbsp;&nbsp;&nbsp;&nbsp;'
                    if (fileInfo.isImage === true) {
                        htmlStr += '<img src="/fs/' + fileInfo.path + '" style="width: 8em" alt="' + fileInfo.filename + '">&nbsp;&nbsp;'
                    } else {
                        htmlStr += '<img src="' + fileImageUri + '" alt="file" style="width: 1.5em">'
                    }
                    if (fileInfo.meta != null) {
                        htmlStr += '<a href="' + downloadUri + '?key=' + key + '">key: ' + key + '</a>'
                    }
                    htmlStr += '&nbsp;&nbsp;&nbsp;&nbsp;'
                    htmlStr += '<a href="/fs/' + fileInfo.path + '">' + window.location.origin + '/fs/' + fileInfo.path + '</a>'
                    // 文件大小信息
                    htmlStr += '&nbsp;&nbsp;文件大小: ' + fileInfo.fileSizeInfo
                }
                htmlStr += '</li><br/>'
            }
            document.getElementById("fileList").innerHTML = htmlStr
        })
    }

    function deleteFile(key) {
        ajax(deleteFileUri, "POST", {"key": [key]}, function (result) {
            if (result.code === 200) {
                document.getElementById("btn-" + key).parentElement.remove()
            } else {
                alert(result.code + ": " + result.msg)
            }
        })
    }

    function getPath() {
        let pos = document.baseURI.indexOf('?')
        if (pos === -1) {
            return document.baseURI.substring(4 + document.baseURI.indexOf("/fs/", 8))
        } else {
            return document.baseURI.substring(4 + document.baseURI.indexOf("/fs/", 8), pos)
        }
    }
</script>
